/* viewer.css */
.scroll-pane {
    -fx-background-color: #000000;
    -fx-border-color: transparent;
}

.scroll-pane .viewport {
    -fx-background-color: transparent;
}

.scroll-pane .content {
    -fx-background-color: #000000;
}

.scroll-bar:vertical .track,
.scroll-bar:horizontal .track {
    -fx-background-color: transparent;
}

.scroll-bar:vertical .thumb,
.scroll-bar:horizontal .thumb {
    -fx-background-color: rgba(255,255,255,0.3);
    -fx-background-radius: 5px;
}

.button {
    -fx-background-color: rgba(255,255,255,0.1);
    -fx-text-fill: white;
    -fx-font-size: 14px;
    -fx-padding: 8 16;
    -fx-border-radius: 5px;
}

.button:hover {
    -fx-background-color: rgba(255,255,255,0.2);
}

.button:pressed {
    -fx-background-color: rgba(255,255,255,0.3);
}

#photoName {
    -fx-text-fill: white;
    -fx-font-size: 20px;
    -fx-effect: dropshadow(gaussian, rgba(0,0,0,0.5), 5, 0, 0, 2);
}

.image-view {
    -fx-effect: dropshadow(gaussian, rgba(0,0,0,0.3), 10, 0, 0, 4);
}

#pageInfo {
    -fx-z-index: 9999;        /* 强制顶层显示 */
    -fx-effect: dropshadow(three-pass-box, rgba(0,0,0,0.8), 8, 0.5, 0, 2); /* 加强阴影 */
    -fx-padding: 5 15;        /* 增加内边距 */
}